<%@ page language="java"  pageEncoding="UTF-8"%>
<jsp:include page="../inc.jsp"></jsp:include>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="basePath" scope="session" value="${pageContext.request.contextPath}"></c:set>
    <div region="center" style="padding: 1px; width: 544px; height: 696px;" title="" class="panel-body panel-body-noheader layout-body panel-noscroll"> 
	<script type = "text/javascript" >
	 $(function() {
	    storage = $.localStorage;
	    if (!storage) storage = $.cookieStorage;
	    $('#roleList').datagrid({
	        idField: 'id',
	        title: '角色列表',
	        url: 'list',
	        fit: true,
	        loadMsg: '数据加载中...',
	        pageSize: 10,
	        pagination: true,
	        pageList: [10, 20, 30],
	        sortName: 'id',
	        sortOrder: 'desc',
	        rownumbers: true,
	        singleSelect: true,
	        fitColumns: true,
	        striped: true,
	        showFooter: true,
	        frozenColumns: [[]],
	        columns: [[{
	            field: 'id',
	            title: '编码',
	            hidden: true,
	            sortable: true
	        },
	        {
	            field: 'name',
	            title: '角色名称',
	            sortable: true,
	            width:10
	          
	        },
	        {
	            field: 'opt',
	            title: '操作',  
	            width:20,
	            formatter: function(value, rec, index) {
	                if (!rec.id) {
	                    return '';
	                }
	                var href = '';
	                href += "[<a href='#' onclick=delRole('" + rec.id + "','" + index + "')>";
	                href += "删除</a>]";
	                href += "[<a href='#' onclick=userListbyrole('" + rec.id + "','" + rec.name + "','" + index + "')>";
	                href += "用户</a>]";
	                href += "[<a href='#' onclick=setfunbyrole('" + rec.id + "','" + rec.name + "','" + index + "')>";
	                href += "权限设置</a>]";
	                return href;
	            }
	        }]],
	        onLoadSuccess: function(data) {
	            $("#roleList").datagrid("clearSelections");
	        },
	        onClickRow: function(rowIndex, rowData) {
	          /*   rowid = rowData.id;
	            gridname = 'roleList'; */
	        }
	    });
	    $('#roleList').datagrid('getPager').pagination({
	        beforePageText: '',
	        afterPageText: '/{pages}',
	        displayMsg: '{from}-{to}共 {total}条',
	        showPageList: true,
	        showRefresh: true
	    });
	    $('#roleList').datagrid('getPager').pagination({
	        onBeforeRefresh: function(pageNumber, pageSize) {
	            $(this).pagination('loading');
	            $(this).pagination('loaded');
	        }
	    });
	    try {
	        restoreheader();
	    } catch(ex) {}
	});
	function reloadTable() {
	    try {
	        $('#' + gridname).datagrid('reload');
	        $('#' + gridname).treegrid('reload');
	    } catch(ex) {}
	}
	function reloadroleList() {
	    $('#roleList').datagrid('reload');
	}
	function getroleListSelected(field) {
	    return getSelected(field);
	}
	function getSelected(field) {
	    var row = $('#' + gridname).datagrid('getSelected');
	    if (row != null) {
	        value = row[field];
	    } else {
	        value = '';
	    }
	    return value;
	}
	function getroleListSelections(field) {
	    var ids = [];
	    var rows = $('#roleList').datagrid('getSelections');
	    for (var i = 0; i < rows.length; i++) {
	        ids.push(rows[i][field]);
	    }
	    ids.join(',');
	    return ids
	};
	function getSelectRows() {
	    return $('#roleList').datagrid('getChecked');
	}
	function saveHeader() {
	    var columnsFields = null;
	    var easyextends = false;
	    try {
	        columnsFields = $('#roleList').datagrid('getColumns');
	        easyextends = true;
	    } catch(e) {
	        columnsFields = $('#roleList').datagrid('getColumnFields');
	    }
	    var cols = storage.get('roleListhiddenColumns');
	    var init = true;
	    if (cols) {
	        init = false;
	    }
	    var hiddencolumns = [];
	    for (var i = 0; i < columnsFields.length; i++) {
	        if (easyextends) {
	            hiddencolumns.push({
	                field: columnsFields[i].field,
	                hidden: columnsFields[i].hidden
	            });
	        } else {
	            var columsDetail = $('#roleList').datagrid("getColumnOption", columnsFields[i]);
	            if (init) {
	                hiddencolumns.push({
	                    field: columsDetail.field,
	                    hidden: columsDetail.hidden,
	                    visible: (columsDetail.hidden == true ? false: true)
	                });
	            } else {
	                for (var j = 0; j < cols.length; j++) {
	                    if (cols[j].field == columsDetail.field) {
	                        hiddencolumns.push({
	                            field: columsDetail.field,
	                            hidden: columsDetail.hidden,
	                            visible: cols[j].visible
	                        });
	                    }
	                }
	            }
	        }
	    }
	    storage.set('roleListhiddenColumns', JSON.stringify(hiddencolumns));
	}
	function restoreheader() {
	    var cols = storage.get('roleListhiddenColumns');
	    if (!cols) return;
	    for (var i = 0; i < cols.length; i++) {
	        try {
	            if (cols.visible != false) $('#roleList').datagrid((cols[i].hidden == true ? 'hideColumn': 'showColumn'), cols[i].field);
	        } catch(e) {}
	    }
	}
	function resetheader() {
	    var cols = storage.get('roleListhiddenColumns');
	    if (!cols) return;
	    for (var i = 0; i < cols.length; i++) {
	        try {
	            $('#roleList').datagrid((cols.visible == false ? 'hideColumn': 'showColumn'), cols[i].field);
	        } catch(e) {}
	    }
	}
	function roleListsearch() {
	    var queryParams = $('#roleList').datagrid('options').queryParams;
	    $('#roleListtb').find('*').each(function() {
	        queryParams[$(this).attr('name')] = $(this).val();
	    });
	    $('#roleList').datagrid({
	        url: 'roleController.do?roleGrid&field=id,roleCode,roleName,createBy,createDate,updateBy,updateDate,',
	        pageNumber: 1
	    });
	}
	function dosearch(params) {
	    var jsonparams = $.parseJSON(params);
	    $('#roleList').datagrid({
	        url: 'roleController.do?roleGrid&field=id,roleCode,roleName,createBy,createDate,updateBy,updateDate,',
	        queryParams: jsonparams
	    });
	}
	function roleListsearchbox(value, name) {
	    var queryParams = $('#roleList').datagrid('options').queryParams;
	    queryParams[name] = value;
	    queryParams.searchfield = name;
	    $('#roleList').datagrid('reload');
	}
	$('#roleListsearchbox').searchbox({
	    searcher: function(value, name) {
	        roleListsearchbox(value, name);
	    },
	    menu: '#roleListmm',
	    prompt: '请输入查询关键字'
	});
	function EnterPress(e) {
	    var e = e || window.event;
	    if (e.keyCode == 13) {
	        roleListsearch();
	    }
	}
	function searchReset(name) {
	    $("#" + name + "tb").find(":input").val("");
	    roleListsearch();
	} </script>   
  <div class="panel datagrid" style="width: 544px;">
   <div class="datagrid-wrap panel-body" title="" style="width: 542px; height: 671px;">
    <div id="roleListtb" style="padding:3px; height: auto" class="datagrid-toolbar">
     <div name="searchColums">
      <input id="_sqlbuilder" name="sqlbuilder" type="hidden" />
     </div>
     <div style="height:30px;" class="datagrid-toolbar">
      <span style="float:left;">
      <a href="#" class="easyui-linkbutton l-btn l-btn-plain" plain="true" icon="icon-add" onclick="add('用户录入','test','userList',null,null)" id="">用户录入</a>
     	</span>
     </div> 
    </div>
    <div class="datagrid-view" style="width: 542x; height: 557px;">
     <table width="100%" id="roleList" toolbar="#roleListtb" style="display: none;"></table>
    </div>
   </div>
  </div>
    </div>
   <div class="panel layout-panel layout-panel-east layout-split-east" style="left: 548px; top: 0px; width: 595px;">
    <div region="east" style="width: 593px; height: 698px;" split="true" title="" class="panel-body panel-body-noheader layout-body panel-noscroll"> 
     <div class="panel" style="display: block; width: 593px;">
      <div tools="#tt" class="easyui-panel panel-body panel-body-noborder panel-noscroll" title="" style="padding: 10px; width: 573px; height: 651px;" fit="true" border="false" id="function-panel">
      </div>
     </div> 
    </div>
   </div> 
   <div id="tt"></div> 
   <div class="layout-split-proxy-h"></div>
   <div class="layout-split-proxy-v"></div>
  <div id="roleListmm" style="width: 135px; display: none; left: 281px; top: 59px; z-index: 110001;" class="menu-top menu">
   <div class="menu-line"></div>
   <div data-options="name:'roleName',iconCls:'icon-ok'  " name="roleName" href="" class="menu-item" style="height: 20px;">
    <div class="menu-text">
     角色名称
    </div>
    <div class="menu-icon icon-ok"></div>
   </div> 
  </div>
  <div class="menu-shadow" style="display: none; z-index: 110000; left: 281px; top: 59px; width: 141px; height: 28px;"></div>
 <script type="text/javascript">
	function setfunbyrole(id,roleName) {
		$("#function-panel").panel(
			{
				title :roleName+ ':' + '当前权限',
				href:"${basePath}/admin/role/fun?id=" +id
			}
		);
		$('#function-panel').panel("refresh" );
		
	}
	function userListbyrole(id,roleName) {
		$("#function-panel").panel(
			{
				title :roleName+ ':' + '用户',
				href:"roleController.do?userList&roleId=" + id
			}
		);
		$('#function-panel').panel("refresh" );
		
	}
	//删除角色
	function delRole(id){
		var tabName= 'roleList';
		var url= 'roleController.do?delRole&id='+id;
		$.dialog.confirm('确定删除该记录吗', function(){
			doSubmit(url,tabName);
			rowid = '';
			$("#function-panel").html("");//删除角色后，清空对应的权限
		}, function(){
		});
	}
</script>
 </body>
</html>